//
//  NavigetionViewStudy.swift
//  NaiCha
//
//  Created by 唐安坤 on 2024/9/10.
//

import SwiftUI

struct NavigetionViewStudy: View {
    
    @State var isExpanded = true
    @State var goSettings = false
    @EnvironmentObject var settingStore: SettingStore
    
    fileprivate var dataArr = [
        MyDogModel.init(image: "dog01", dogName: "汪汪01"),
        MyDogModel.init(image: "dog02", dogName: "汪汪02"),
        MyDogModel.init(image: "dog03", dogName: "汪汪03"),
        MyDogModel.init(image: "dog04", dogName: "汪汪04"),
        MyDogModel.init(image: "dog05", dogName: "汪汪05"),
        MyDogModel.init(image: "dog06", dogName: "汪汪06")
    ]
    
    var body: some View {
        NavigationStack{
            List {
                ForEach(dataArr) { model in
                    MyDogCardView(image: model.image, name: model.dogName)
                        .listRowInsets(EdgeInsets())
                        .padding(EdgeInsets(top: 0, leading: 15, bottom: CGFloat(settingStore.gap), trailing: 15))
                        .background {
                        NavigationLink("") {
                            NavigetionViewDetail(model: model)
                        }
                    }
                }
            }
            .scrollIndicators(.hidden)
            .listStyle(.plain)
            .navigationTitle("宠物")
            .toolbar(content: {
                
                Button(action: {
                    goSettings = true
                }, label: {
                    Image(systemName: "gearshape").foregroundColor(.gray)
                })
                
//                NavigationLink {
//                    Settings()
//                } label: {
//                    Image(systemName: "gearshape").foregroundColor(.gray)
//                }
            })
        }.fullScreenCover(isPresented: $goSettings, content: {
            Settings()
        })
    }
}


struct MyDogModel: Identifiable{
    var id: UUID = UUID()
    var image:String
    var dogName: String
    
}

#Preview {
    NavigetionViewStudy()
}

struct MyDogCardView: View {
    @State var image: String
    @State var name: String
    @EnvironmentObject var settingStore: SettingStore
    var body: some View {
        
        VStack{
            HStack {
                Text(name).font(.system(size: 30,weight: .bold))
                
                Spacer()
            }
            
            VStack{
                Image(image, bundle: nil)
                    .resizable()
                    .aspectRatio(contentMode: .fill)
                    .frame(height: 200)
                    .clipShape(RoundedRectangle(cornerRadius: 15))
            }
            
            HStack(alignment:.bottom){
                
                if settingStore.selection == .showAll{
                    HStack {
                        Image(systemName: "heart.fill").foregroundColor(.pink).font(.system(size: 12))
                        Text("3.2K").foregroundColor(.pink).font(.system(size: 12))
                    }
                    .padding(EdgeInsets(top: 3, leading: 3, bottom: 3, trailing: 3))
                    .background(.pink.opacity(0.3))
                    .clipShape(RoundedRectangle(cornerSize: CGSize(width: 3, height: 3)))
                    
                    HStack {
                        Image(systemName: "heart.fill").foregroundColor(.blue).font(.system(size: 12))
                        Text("3.2K").foregroundColor(.blue).font(.system(size: 12))
                    } .padding(EdgeInsets(top: 3, leading: 3, bottom: 3, trailing: 3))
                        .background(.blue.opacity(0.3))
                        .clipShape(RoundedRectangle(cornerSize: CGSize(width: 3, height: 3)))
                       
                }
                Spacer()
                if settingStore.selection == .onlyPrice || settingStore.selection == .showAll{
                    Text("$").font(.system(size: 20)).foregroundColor(.pink)
                    Text("5999").font(.system(size: 20)).foregroundColor(.pink)
                }
                
            }.padding(.top)
            
        }
        .listRowSeparator(.hidden)
        .padding()
        .background(.white)
        .clipShape(RoundedRectangle(cornerSize: CGSize(width: 10, height: 10)))
        .shadow(color: .gray, radius: 5, x: 0.0, y: 5)
    }
}

